<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../org/angular-ui-router.min.js"></script>
    <script src="../org/angular.min.js"></script>
    <script src="../org/jquery.min.js"></script>
</head>

<body>
   <div ng-app='hd'>
     <div ui-view="top"></div>
     <div ui-view='left'></div>
     <div ui-view='right'></div>

   </div>

    <script>
       var vm = angular.module('hd',['ui.router']);
       vm.config(['$stateProvider','$urlRouterProvider',function($stateProvider,$urlRoutersProvider){
           //默认页面跳转路由
           $urlRouterProvider.otherwise('/my');

           //定有规则
           $stateProvider.state('my',{
               url: '/my',
            //    template: ""
            views: {
                top: {
                    templateUrl: 'view/top.html'
                },
                left: {
                    templateUrl: 'view/menu.html'
                },
                right: {
                    templateUrl: 'view/about.html'
                }
            }
           })
           .state('video',{
               url: '/video',
               views: {
                   top: {
                       templateUrl: 'view/top.html'
                   },
                   left: {
                       templateUrl: 'view/menu.html',
                   },
                   right: {
                       templateUrl: 'view/video_lists.html'
                   }
               }
           })

       }])
    </script>
</body>

</html>